<template>`
    <view calss="smart-page">
        <view class="smart-page-head">
            <view calss="smart-page-head-title">slider</view>
        </view>
        <view>显示当前view</view>
        <view><slider value="20" show-value="true" @change="sliderChange"></slider></view>
        <view>设置步长</view>
        <view><slider value="20" show-value="true" @change="sliderChange" step="5"></slider></view>
        <view>设置步长</view>
        <view><slider value="20" show-value="true" value="100" max="500" min="50"></slider></view>
        <view>设置颜色</view>
        <view>
            <sllider activeColor="red" backgroundColor="green" block-color="brown" block-size="15"></sllider>
        </view>
    </view>
</template>

<script>
    export default{
        data(){
            return{

            }
        },
        methods:{
            sliderChange(e){
                console.Log(e.detail.value)
            }
        }
</script>